<!DOCTYPE html>
<html class="x-admin-sm">
    <head>
        <meta charset="UTF-8">
        <title>欢迎页面-X-admin2.2</title>
        <meta name="renderer" content="webkit">
        <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
        <meta name="viewport" content="width=device-width,user-scalable=yes, minimum-scale=0.4, initial-scale=0.8,target-densitydpi=low-dpi" />
        <link rel="stylesheet" href="./css/font.css">
        <link rel="stylesheet" href="./css/xadmin.css">
        <script type="text/javascript" src="./lib/layui/layui.js" charset="utf-8"></script>
        <script type="text/javascript" src="./js/xadmin.js"></script>
        <!-- 让IE8/9支持媒体查询，从而兼容栅格 -->
        <!--[if lt IE 9]>
            <script src="https://cdn.staticfile.org/html5shiv/r29/html5.min.js"></script>
            <script src="https://cdn.staticfile.org/respond.js/1.4.2/respond.min.js"></script>
        <![endif]--></head>
    
    <body>
        <div class="layui-fluid">
            <div class="layui-row">
                <form class="layui-form">
                    <div class="layui-form-item">
                        <label for="L_username" class="layui-form-label">
                            <span class="x-red">*</span>昵称</label>
                        <div class="layui-input-inline">
                            <input type="text" id="L_username" name="username" required="" lay-verify="nikename" autocomplete="off" class="layui-input"></div>
                    </div>
                    <div class="layui-form-item">
                        <label class="layui-form-label">性别</label>
                        <div class="layui-input-block">
                            <input type="radio" name="sex" value="1" title="男">
                            <input type="radio" name="sex" value="0" title="女">
                        </div>
                    </div>
                    <div class="layui-form-item">
                        <label for="identity" class="layui-form-label">
                            <span class="x-red">*</span>身份证号</label>
                        <div class="layui-input-inline">
                            <input type="text" id="identity" name="identity" required="" lay-verify="IDcard" autocomplete="off" class="layui-input"></div>
                    </div>
                    <div class="layui-form-item">
                        <label for="bankcard" class="layui-form-label">
                            <span class="x-red">*</span>银行卡号</label>
                        <div class="layui-input-inline">
                            <input type="text" id="bankcard" name="bankcard" required="" lay-verify="BankCard" autocomplete="off" class="layui-input"></div>
                    </div>
                    <div class="layui-form-item">
                        <label for="phone" class="layui-form-label">
                            <span class="x-red">*</span>手机号码</label>
                        <div class="layui-input-inline">
                            <input type="text" id="phone" name="phone" required="" lay-verify="PhoneRule" autocomplete="off" class="layui-input"></div>
                    </div>
                    <div class="layui-form-item">
                        <label for="L_email" class="layui-form-label">
                            <span class="x-red">*</span>邮箱</label>
                        <div class="layui-input-inline">
                            <input type="text" id="L_email" name="email" required="" lay-verify="email" autocomplete="off" class="layui-input"></div>
                        <div class="layui-form-mid layui-word-aux">
                            </div>
                    <div class="layui-form-item">
                        <label for="L_email" class="layui-form-label"></label>
                        <button class="layui-btn" lay-filter="update2" lay-submit="">修改</button></div>
                </form>
            </div>
        </div>
        <script>layui.use(['form', 'layer'],
            function() {
                $ = layui.jquery;
                var form = layui.form,
                layer = layui.layer;

                //自定义验证规则
                form.verify({
                    nikename: function(value) {
                        if (value.length < 2) {
                            return '昵称至少得2个字符啊';
                        }
                    },
                    PhoneRule: function(value) {
                        var TEL_REGEXP =/^1([38][0-9]|4[579]|5[0-3,5-9]|6[6]|7[0135678]|9[89])\d{8}$/;
                        if (!(TEL_REGEXP).test(value)) {
                            return '手机号格式不对';
                        }
                    },
                    BankCard: function(value) {
                        if (value.length < 16) {
                            return '银行卡号不少于16位数';
                        }
                    },
                    IDcard: function(value) {
                        var IDRule=/^[1-9]\d{5}[1-9]\d{3}((0\d)|(1[0-2]))(([0|1|2]\d)|3[0-1])\d{4}$/;
                        if (!(IDRule).test(value)) {
                            return '身份证号格式不对';
                        }
                    },

                });
                var id=location.search.split("=")[1];
                $.ajax({
                    type: "POST",
                    url:"GetUserByID",
                    contentType: "application/json;charset=UTF-8",
                    dataType: "json",
                    data:JSON.stringify({
                        "id" : id
                    }),
                    success:function (data) {
                        $("#L_username").val(data.username)
                        $("#L_email").val(data.email)
                        $("#phone").val(data.phone)
                        $("#bankcard").val(data.bankcard)
                        $("#identity").val(data.identity)
                        $("#L_pass").val(data.password)
                        $('[name=sex]').each(function(i,item){
                            if($(item).val()==data.gender){
                                $(item).prop('checked',true);
                                layui.use('form',function(){
                                    var form = layui.form;
                                    form.render();
                                });
                            }
                        });

                    }
                })
                //监听提交
                form.on('submit(update2)',
                function(data) {
                    console.log(data);
                    //发异步，把数据提交给php
                    var array = new Array();
                    array.push(id)
                    $.ajax({
                        type: "POST",
                        url:"UpdateUserByID",
                        contentType: "application/json;charset=UTF-8",
                        dataType: "json",
                        data:JSON.stringify({
                            userInfoIds:array,
                            email:$("#L_email").val(),
                            username:$("#L_username").val(),
                            gender:$('[name=sex]:checked').val(),
                            identity:$("#identity").val(),
                            bankcard:$("#bankcard").val(),
                            phone:$("#phone").val(),
                            password:$("#L_pass").val()
                        }),
                        success:function (data) {
                            if (data==true){
                                layer.alert("修改成功", {
                                        icon: 6
                                    },
                                    function() {
                                        //关闭当前frame
                                        xadmin.close();

                                        // 可以对父窗口进行刷新
                                        xadmin.father_reload();
                                    });
                            } else {
                                alert("修改失败！")
                            }
                        },
                        error:function (data) {
                            console.log(data)
                        }
                    })
                    return false;
                });
            });
        </script>
    </body>

</html>